<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
     <title>Mode Tableau</title>
     <link rel="stylesheet" href="css/style.css" type="text/css">
     <meta name="viewport" content="width=device-width" />
</head>

<body>
	<header>
		<h1 class="title">Mode Tableau</h1>
	</header>
	<main>
		<h3>La palette des stylets</h3>
		<p>La palette des stylets vous donne accès à des outils essentiels quand on travaille sur un tableau blanc.</p>
		<div class="image"><img id="bo1" src="../../assets/hint2/bo1.png" alt=""></div>

		<p>Vous y trouverez le crayon (<span class="icon"><img src="../../assets/common/pen.png" alt=""></span>), la gomme (<span class="icon"><img src="../../assets/common/eraser.png" alt=""></span>) et le surligneur (<span class="icon"><img src="../../assets/common/marker.png" alt=""></span>). OpenBoard fournit également des fonctionnalités qu'un tableau blanc classique ne peut pas fournir :</p>
		<ul>
			<li><span class="icon"><img src="../../assets/common/arrow.png" alt=""></span> est le sélecteur. Avec, vous pouvez sélectionner et interagir avec des objets.</li>
			<li><span class="icon"><img src="../../assets/common/handPlay.png" alt=""></span> est le doigt magique. Vous pouvez déplacer des objets ou interagir avec eux sans qu'il soit nécessaire de les sélectionner.</li>
			<li><span class="icon"><img src="../../assets/common/hand.png" alt=""></span> est la main. Vous pouvez déplacer la page avec. Très utile quand combinée avec les fonctionnalités de zoom !</li>
			<li><span class="icon"><img src="../../assets/common/zoomIn.png" alt=""></span><span class="icon"><img src="../../assets/common/zoomOut.png" alt=""></span> vous donnent la possibilité de zoomer et dézoomer. Sélectionnez simplement l'effet désiré, et cliquer à l'endroit où vous souhaitez l'appliquer !</li>
			<li><span class="icon"><img src="../../assets/common/laser.png" alt=""></span> est un pointeur laser, utile pour pointer des éléments sur le tableau sans interagir avec ces derniers.</li>
			<li><span class="icon"><img src="../../assets/common/line.png" alt=""></span> est utilisé pour tracer des droites facilement.</li>
			<li><span class="icon"><img src="../../assets/common/text.png" alt=""></span> est une boîte de texte, permettant d'écrire au clavier plutôt qu'au crayon.</li>
		</ul>
		
		<span class="tip"><span class="icon"><img src="../../assets/common/tip.png" alt=""></span>Vous pouvez avoir un contrôle plus fin du zoom avec la souris ! Utilisez Ctrl/Cmd + la molette de la souris afin de zoomer/dézoomer avec plus de précision !</span>
		<h3>La barre du tableau</h3>
		<p>La barre du tableau vous permet de changer la couleur et/ou la taille du crayon et marqueur, entre autres choses.</p>
		<div class="image"><img id="bo9" src="../../assets/hint2/bo9.png" alt=""></div>

		<p>Vous y trouverez également la possibilité de changer le fond du tableau en cliquant sur <span class="icon"><img src="../../assets/common/background.png" alt=""></span></p>
		<div class="image"><img src="../../assets/hint2/bo-gif1.gif" alt=""></div>
		
		<p>Vous y trouverez aussi des fonctionnalités comme annuler/rétablir, créer et naviguer de pages en pages, effacer le tableau, ...</p>
		
		<span class="tip"><span class="icon"><img src="../../assets/common/tip.png" alt=""></span>Vous pouvez effacer entièrement des éléments plus spécifiques du tableau, en faisant un clic long sur <span class="icon"><img src="../../assets/common/clearPage.png" alt="the erase icon"></span>. Quelques fonctionnalités supplémentaires accessibles également pour <span class="icon"><img src="../../assets/common/newDocument.png" alt="the erase icon"></span> !</span>
	</main>
	<footer>

	</footer>
</body>
</html>
